<div class="login">
  <canvas id="login-canvas"></canvas>
  <div class="login-box">
    <h1 class="login-box-header">
      <a href="#">
        <img src="https://gw.alipayobjects.com/zos/rmsportal/NGCCBOENpgTXpBWUIPnI.svg">
        <span>个股期权管理系统</span>
      </a>
    </h1>
    <div class="login-box-nav">
      <form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="_submitForm()">
        <nz-form-item>
          <nz-form-control [nzValidateStatus]="validateForm.controls.userName">
            <nz-input-group nzPrefixIcon="anticon anticon-user">
              <input nz-input formControlName="userName" placeholder="帐号">
            </nz-input-group>
            <nz-form-explain *ngIf="validateForm.controls.userName.dirty&&validateForm.controls.userName.hasError('required')">请输入用户名！</nz-form-explain>
          </nz-form-control>
        </nz-form-item>
        <nz-form-item>
          <nz-form-control [nzValidateStatus]="validateForm.controls.password">
            <nz-input-group nzPrefixIcon="anticon anticon-lock">
              <input type="password" nz-input formControlName="password" placeholder="密码">
            </nz-input-group>
            <nz-form-explain *ngIf="validateForm.controls.password.dirty&&validateForm.controls.password.hasError('required')">请输入密码！</nz-form-explain>
          </nz-form-control>
        </nz-form-item>
        <nz-form-item>
          <nz-form-control>
            <button nz-button class="login-form-button" [nzType]="'primary'" [nzLoading]="isLoading">登录</button>
          </nz-form-control>
        </nz-form-item>
      </form>
    </div>
  </div>
</div>